<template>
    <button v-for="item of hots" :key="item" @click="handleCity(item)">{{item}}</button>
</template>

<script>
import { reactive, toRefs } from '@vue/reactivity';
export default {
   setup(){
       const state =reactive({
           hots:["武汉","厦门","深圳","广州"],
           handleCity(val){
               console.log(val);
               this.$store.commit("changeCity",val)
               this.$router.back()

           }

       })
       const refsState =toRefs(state) 
       return{
           ...refsState
       }
   }
};
</script>

<style  scoped>

</style>